<template>
    <div class="contents">
    <div class="information">
      <el-row :gutter="20">
        <!-- <el-col :span="5">
          <div class="grid-content">基础信息</div>
        </el-col> -->
        <el-col :span="15">
          <div class="bg-purple">
            <p>
              桥梁名称：
              <span>{{detail.name}}</span>
            </p>
            <p>
              桥梁编号：
              <span>{{detail.code}}</span>
            </p>
            <p>
              桥梁类型：
              <span>{{detail.bridgeTypeName}}</span>
            </p>
            <p>
              桥梁全长：
              <span>{{detail.length}}(米)</span>
            </p>
            <p>
              地区：
              <span>{{detail.provinceName}}/{{detail.municipalityName}}/{{detail.regionName}}</span>
            </p>
            <p>
              详细地址：
              <span>{{detail.address}}</span>
            </p>
            <p>
              桥梁种类：
              <span>{{detail.bridgeKindName}}</span>
            </p>
            <p>
              备注：
              <span>{{detail.remark}}</span>
            </p>
            <p>
              缩略图：
              <span>
                   <el-image
                    style="width: 100px; height: 100px;"
                    :src="download + detail.realisticPictureList[0].path"
                    :preview-src-list="[download + detail.realisticPictureList[0].path]"
                  ></el-image>
              </span>
            </p>
          </div>
        </el-col>
      </el-row>
    </div>
    </div>
</template>
<script>
import base from "../../../api/base";
export default {
    name: 'bridgeInfoDetail',
    data(){
        return {
      download: base.DOWNLOADURL,
        }
    },
    props:{
        detail:{
            type: Object,
            default(){
                return {}
            }
        }
    }
}
</script>
<style scoped lang="scss">
.contents {
  .information {
    margin-top: 50px;
    width: 100%;
    padding-bottom: 25px;
    .grid-content:nth-child(1) {
      font-size: 18px;
      text-align: center;
      line-height: 35px;
    }
    .bg-purple {
      font-size: 16px;
      margin-left: 65px;
      line-height: 38px;
      p {
        color: #999999;
        span {
          color: black;
        }
      }
    }
  }
}
</style>